﻿<?php
include ('includes/config.php');
include ('includes/functions.php');
include ('includes/front_functions.php');
include ('control/hotel.php');
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<html>
<head>
	<meta http-equiv="content-type" content="text/html; charset=utf-8" />
	<meta name="author" content="YDuyBya" />
    <title>Khách Sạn Đà Nẵng</title>
	<link rel="stylesheet" href="css/ui-lightness/jquery-ui-1.8.18.custom.css" type="text/css" />
    <link rel="stylesheet" href="css/style.css" type="text/css" />
	<link rel="stylesheet" href="css/infobox.css" type="text/css" />
	<script type='text/javascript' charset="utf-8" src='js/OpenLayers-2.12/OpenLayers.js'></script> <!-- thu vien openlayers -->
	<script type='text/javascript' charset="utf-8" src='js/map.js'></script>  <!-- tao ban do -->
	<script type='text/javascript' charset="utf-8" src='js/search.js'></script> <!-- tim kiem khach san -->
	<script type="text/javascript" charset="utf-8" src="js/jquery-1.7.2.min.js"></script>
    <script type="text/javascript" charset="utf-8" src="js/jquery-ui-1.7.2.min.js"></script>
	<script type="text/javascript" charset="utf-8" src="js/jquery-ui-1.8.17.custom.min.js"></script> <!-- new -->
    <script type="text/javascript" charset="utf-8" src="js/jquery.validate.min.js"></script>
	<script type="text/javascript">
		$(document).ready(function(){
		
		/* Side Bar */
		$("#sidebar h3:first").addClass("active");
		$("#sidebar div:not(:first)").hide();

		$("#sidebar h3").click(function(){
			$(this).next("div").slideToggle("fast")
			.siblings("div:visible").slideUp("fast");
			$(this).toggleClass("active");
			$(this).siblings("h3").removeClass("active");
		});

		
		/* Slide Bar Navigation */
		$(function() {
			$('#navigation a').stop().animate({'marginLeft':'-85px'},1000);

			$('#navigation > li').hover(
				function () {
					$('a',$(this)).stop().animate({'marginLeft':'-2px'},200);
				},
				function () {
					$('a',$(this)).stop().animate({'marginLeft':'-85px'},200);
				}
			);
		});
		
		/* Show Hide Slide Bar */
		$("#navigation .showmenu").click(function() {
			$("#left").toggle("slide", { direction: "left" }, 2);
			if ($("#map-element").css("width") == "646px") {
				$("#map-element").width(998);
			} else {
				$("#map-element").width(646);
			}
			refdiv();
			return false;
		});
		
		// Dua chuot vao o tu dong xoa du lieu
		$('form#searchForm input#query').focus(function() {
			if ($('form#searchForm input#query').val() === 'Nhập tên khách sạn') {
				$('form#searchForm input#query').val('');
			}
		});
		
		// Roi khoi o tu dong dien du lieu
		$('form#searchForm input#query').blur(function() {
			if ($('form#searchForm input#query').val() === '') {
				$('form#searchForm input#query').val('Nhập tên khách sạn');
			}
		});
		
		// if text input field value is not empty show the "X" button
		$('form#searchForm input#query').keyup(function() {
			$('#delete #x').fadeIn();
			if ($.trim($('form#searchForm input#query').val()) == "") {
				$('#delete #x').fadeOut();
			}
		});
		
		// on click of "X", delete input field value and hide "X"
		$('#delete #x').click(function() {
			$('form#searchForm input#query').val('');
			$(this).hide();
		});

	});
		
		function search(str, district) {
			//document.getElementById("txtHint").innerHTML=str;
			var dname = district.options[district.selectedIndex].value;
			if((str == "") && (dname == "0"))
			{
				return;
			}
			if (window.XMLHttpRequest)
			  {// code for IE7+, Firefox, Chrome, Opera, Safari
			  xmlhttp=new XMLHttpRequest();
			  }
			else
			  {// code for IE6, IE5
			  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
			  }
			xmlhttp.onreadystatechange=function()
			  {
			  if (xmlhttp.readyState==4 && xmlhttp.status==200)
				{
				document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
				}
			  }
			
			xmlhttp.open("GET","search.php?name="+str+"&district="+dname,true);
			xmlhttp.send();
		}
		
		function refdiv(){
      document.getElementById("map-element").innerHTML = "";
      init();
  }
  function display_alert()
  {
  alert("Hello! I am an alert box!!");
  }
		
    </script>
</head>

<body onload="init()">
<div id="wrapper">
	<div id="header">
		<ul>
		</ul>
		<div id="logo"><img src="images/banner.jpg" /></div>
		<div id="main-nav">
			<ul>
				<li><a href="index.php#">Trang chủ</a></li>
				<li><a href="index.php?mod=news">Tin tức</a></li>
				<li><a href="index.php?mod=map">Bản đồ</a></li>
				<li><a href="index.php?mod=about">Giới thiệu</a></li>
				<li><a href="index.php?mod=contact">Liên Hệ</a></li>
				<li><a href="index.php?mod=admin">Quản Trị</a></li>
			</ul>
		</div>
	</div><!-- end #header -->
	<ul id="navigation">
        <li class="showmenu"><a href="#" title="Hiện/Ẩn thanh menu"></a></li>
    </ul><!--End Navigation-->
	<div id="main-body">
		<div id="left">
            <div id="sidebar">
                <h3>Tìm kiếm trên bản đồ</h3>
					<div class="slideContent" id="searchInMap">
						<form id="searchForm" name="searchForm" method="post" action="">
							<p>
								<input id="query" name="query" type="text" value="Nhập tên khách sạn" />
								<span id="delete"><span id="x">x</span></span>
								<input id="search" name="search" type="submit" value="Tìm kiếm" onclick="return searchInMap();"/>
							</p>
							<p>
								<select id="district" name="district">
									<option value="all">Tất cả các quận huyện</option>
									<option value="Quận Sơn Trà">Quận Sơn Trà</option>
									<option value="Quận Ngũ Hành Sơn">Quận Ngũ Hành Sơn</option>
									<option value="Quận Thanh Khê">Quận Thanh Khê</option>
									<option value="Quận Cẩm Lệ">Quận Cẩm Lệ</option>
									<option value="Huyện Hòa Vang">Huyện Hòa Vang</option>
									<option value="Quận Hải Châu">Quận Hải Châu</option>
									<option value="Quận Liên Chiểu">Quận Liên Chiểu</option>
								</select>
							</p>
						</form>
					</div>
				<h3>Đo đạc trên bản đồ</h3>
				<div id="measure" class="slideContent">
					<form id="controlToggle" action="">
						<fieldset class="methods">
							<legend>Chọn phương pháp đo</legend>
							<p>
								<input type="radio" name="type" value="none" id="noneToggle"
								   onclick="toggleControl(this);" checked="checked" />
								<label for="noneToggle">Di chuyển</label>
							</p>
							<p>
								<input type="radio" name="type" value="line" id="lineToggle" onclick="toggleControl(this);" />
								<label for="lineToggle">Đo khoảng cách</label>
							</p>
							<p>
								<input type="radio" name="type" value="polygon" id="polygonToggle" onclick="toggleControl(this);" />
								<label for="polygonToggle">Đo diện tích</label>
							</p>
						</fieldset>
						<fieldset class="results">
							<legend>Kết quả đo</legend>
							<p id="measureResult">Chưa có kết quả</p>
						</fieldset>
					</form>                
				</div>
				<h3>Tìm đường đi</h3>
				<div id="routingdiv" class="slideContent">
					<p class="none">
						<input type="radio" name="control" id="routingNoneToggle"
							 onclick="routingToggleControl(this);" checked="checked" />
						<label for="routingNoneToggle">Di chuyển</label>
					</p>
					<p class="start">
						<input type="radio" name="control" value="start" id="routingStartToggle"
							 onclick="routingToggleControl(this);" />
						<label for="routingStartToggle">Điểm bắt đầu</label>
					</p>    
					<p class="stop">
						<input type="radio" name="control" value="stop" id="routingStopToggle"
							 onclick="routingToggleControl(this);" />
						<label for="routingStopToggle">Điểm kết thúc</label>
					</p>
					<button name="routing" id="routing" onclick="compute();">Tìm đường</button>
				</div>
            </div><!--End Sidebar-->
        </div><!--End Left-->
		<div id="map-element"></div>
		<!-- Show feature info in a dialog -->
		<div id="info"></div>
		<!-- Hold x, y coordinare -->
		<div id="x" style="display:none"></div>
		<div id="y" style="display:none"></div>
	</div><!-- end #main-body -->
	<div class="clear"></div>
	<div id="footer">
		Đà Nẵng Hotel </br>
		Copyright © 2013 by Y Duy
	</div><!-- end #<!-- end #main-body -->
</div>

</body>
</html>